WPF (Windows Presentation Foundation)-এ Image Control এবং Image Source Binding ব্যবহৃত হয় গ্রাফিক্যাল উপাদান বা ছবি UI তে প্রদর্শন করতে। WPF-এ Image Control একটি UI উপাদান যা ইমেজ বা ছবি প্রদর্শন করার জন্য ব্যবহৃত হয় এবং Image Source Binding এর মাধ্যমে আমরা ডাইনামিকভাবে ছবির উৎস (source) নির্ধারণ করতে পারি, যেমন ফাইল, ইউআরএল, বা রিসোর্স থেকে ইমেজ লোড করা।
Image Control
Image Control WPF-এ একটি কন্ট্রোল যা UI তে ছবি প্রদর্শন করতে ব্যবহৃত হয়। এটি সাধারণত ImageSource এর মাধ্যমে ইমেজ সোর্স নির্ধারণ করে। ImageSource হলো একটি অ্যাবস্ট্রাক্ট টাইপ যা বিভিন্ন রকমের ইমেজ সোর্স যেমন BitmapImage, DrawingImage, বা Icon ইত্যাদি প্রতিনিধিত্ব করে।
Image Control এর বৈশিষ্ট্য (Features of Image Control)
- Source: এটি ইমেজের সোর্স নির্দেশ করে (যেমন ফাইল পাথ, রিসোর্স, অথবা ইউআরএল)।
- Stretch: ইমেজের আকার পরিবর্তন করা বা স্কেল করা (যেমন Uniform, Fill, None, UniformToFill)।
- Width এবং Height: ইমেজের আকার নির্ধারণ করা।
- HorizontalAlignment এবং VerticalAlignment: ইমেজের অবস্থান নির্ধারণ করা।
উদাহরণ:
<Image Source="image.jpg" Width="200" Height="200" Stretch="Uniform"/>
এখানে, image.jpg ফাইলটি Image Control এর সোর্স হিসেবে ব্যবহার করা হয়েছে, এবং ইমেজের সাইজ ২০০x২০০ পিক্সেল নির্ধারণ করা হয়েছে, এবং Stretch="Uniform" ব্যবহার করে ইমেজকে আসল অনুপাত বজায় রেখে স্কেল করা হয়েছে।
Image Source Binding
Image Source Binding হল WPF-এ ডেটা বাইন্ডিং ব্যবহার করে ইমেজ সোর্স পরিবর্তন করার পদ্ধতি। এটি আপনাকে Image Control এর সোর্স প্রপার্টি বাইন্ড করতে সহায়তা করে, যাতে ইমেজ সোর্স ডাইনামিকভাবে পরিবর্তিত হয়। এই বৈশিষ্ট্যটি বিশেষভাবে তখন দরকারি যখন আপনি ইমেজ সোর্সকে ডেটা বা অ্যাপ্লিকেশন স্টেটের সাথে একত্রিত করতে চান।
Image Source Binding এর ব্যবহার (Using Image Source Binding)
Image Source Binding সাধারণত WPF-এ data binding এর মাধ্যমে ব্যবহৃত হয়, যেখানে ইমেজের সোর্স ViewModel বা Code-Behind থেকে আসে।
উদাহরণ:
ধরা যাক, আমাদের কাছে একটি Person ক্লাস আছে, যেটি একটি ProfileImage প্রোপার্টি ধারণ করে:
public class Person
{
public string Name { get; set; }
public string ProfileImage { get; set; }
}
এখন, যদি আমরা এই ProfileImage প্রোপার্টি বাইন্ড করতে চাই Image Control এর সোর্সে, তাহলে XAML কোডে Binding ব্যবহার করা হবে।
<Image Source="{Binding ProfileImage}" Width="200" Height="200"/>
এখানে, Image Control এর Source প্রপার্টি ProfileImage প্রপার্টির সাথে বাইন্ড করা হয়েছে। Person অবজেক্টের ProfileImage প্রপার্টির মান পরিবর্তন হলে, Image Control এর সোর্স স্বয়ংক্রিয়ভাবে আপডেট হবে।
ViewModel-এ Image Source নির্ধারণ:
public class PersonViewModel
{
public Person Person { get; set; }
public PersonViewModel()
{
Person = new Person
{
Name = "John Doe",
ProfileImage = "path/to/profile_image.jpg" // Image file path or URI
};
}
}
এখানে, PersonViewModel এ Person অবজেক্টের ProfileImage প্রপার্টি ছবির ফাইল পাথ ধারণ করছে, যা পরে XAML তে Image Control এর সোর্স হিসেবে ব্যবহার হবে।
Image Source Binding with Resources
WPF-এ আপনি ইমেজ সোর্সকে Resources থেকে বাইন্ডও করতে পারেন। উদাহরণস্বরূপ, আপনি ImageSource কে একটি রিসোর্স হিসেবে ডিফাইন করতে পারেন এবং তারপর সেটি বাইন্ড করতে পারেন।
উদাহরণ:
প্রথমে, আপনি রিসোর্সে একটি ইমেজ নির্ধারণ করবেন:
<Window.Resources>
<BitmapImage x:Key="MyImage" UriSource="path/to/image.jpg"/>
</Window.Resources>
<Image Source="{Binding Source={StaticResource MyImage}}" Width="200" Height="200"/>
এখানে, BitmapImage একটি রিসোর্স হিসেবে নির্ধারণ করা হয়েছে, এবং Image Control এর সোর্স StaticResource MyImage দ্বারা বাইন্ড করা হয়েছে।
Dynamic Image Source Binding
Dynamic Image Source Binding ব্যবহার করে আপনি ইমেজ সোর্সকে ইউজার ইন্টারঅ্যাকশনের মাধ্যমে পরিবর্তন করতে পারেন। এর মাধ্যমে ইউজার কোনো একটি বাটন ক্লিক করলে ইমেজ পরিবর্তন হতে পারে, অথবা অন্য কোনো ইভেন্টের মাধ্যমে ইমেজ সোর্স আপডেট হতে পারে।
উদাহরণ:
public class ViewModel : INotifyPropertyChanged
{
private string _imageSource;
public string ImageSource
{
get { return _imageSource; }
set
{
_imageSource = value;
OnPropertyChanged(nameof(ImageSource));
}
}
public ViewModel()
{
ImageSource = "path/to/initial_image.jpg";
}
public void ChangeImage()
{
ImageSource = "path/to/another_image.jpg";
}
public event PropertyChangedEventHandler PropertyChanged;
protected virtual void OnPropertyChanged(string propertyName)
{
PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
}
}
এখানে, ImageSource প্রপার্টি পরিবর্তিত হলে Image Control এর সোর্স স্বয়ংক্রিয়ভাবে আপডেট হবে। এটি ডাইনামিকভাবে ছবি পরিবর্তনের জন্য ব্যবহার করা যেতে পারে।
XAML কোড:
<Image Source="{Binding ImageSource}" Width="200" Height="200"/>
<Button Content="Change Image" Command="{Binding ChangeImageCommand}"/>
এখানে, Image এর সোর্স ImageSource প্রপার্টির সাথে বাইন্ড করা হয়েছে, এবং একটি বাটন ক্লিকের মাধ্যমে ChangeImageCommand ট্রিগার করলে ছবিটি পরিবর্তিত হবে।
সারাংশ (Summary)
- Image Control: WPF-এ একটি কন্ট্রোল যা UI তে ছবি প্রদর্শন করতে ব্যবহৃত হয়। এর
Sourceপ্রপার্টি ইমেজ সোর্স নির্ধারণ করে। - Image Source Binding: Image Control এর সোর্সকে ডেটা সোর্স (যেমন,
ObservableCollection,ViewModel) এর সাথে বাইন্ড করা হয়, যাতে ডাইনামিকভাবে ছবি পরিবর্তন করা যায়। - Dynamic Image Binding: ব্যবহারকারীর ইন্টারঅ্যাকশন বা অন্য কোনো কার্যকলাপের মাধ্যমে ইমেজ সোর্স পরিবর্তন করা হয়।
WPF তে Image Control এবং Image Source Binding এর মাধ্যমে আপনি আপনার অ্যাপ্লিকেশনকে আরও ইন্টারঅ্যাকটিভ এবং ডাইনামিক করতে পারেন।
Read more